<!DOCTYPE html>
<html lang="zh-cn">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="description" content="ZUI，一个简单吸引人的前端框架。">
  <meta name="author" content="Zentao">

  <title>ZUI - 开源HTML5跨屏框架</title>

  <link href="../css/zui.min.css" rel="stylesheet">
  <link href="../css/example.css" rel="stylesheet">

  <!--[if lt IE 9]>
  <script src="../../assets/html5shiv.js"></script>
  <script src="../../assets/respond.js"></script>
  <![endif]-->
</head>

<body>
  <article>
    <h1>calendar</h1>
    <div class="segment">
      <div id="calendar" class="calendar"></div>
    </div>
  </article>

<script src="../../assets/jquery.js"></script>
<script src="../js/zui.js"></script>
<script src="../js/example.js"></script>

<script>
function afterPageLoad() {
  var now = new Date();
  var start = now.getSeconds(),
      calendars = ['success', 'danger', 'important', 'warning', 'info', 'specail', 'primary'],
      rooms = ['A003', 'A004', 'A010', 'A143', 'B008', 'B098', 'B487', 'B340', 'Z000', 'Z431', 'Z018', 'Z864'],
      peoples = ['奥特曼', '行者孙', '地卜师', '绿巨人', 'Catouse', '路人丙'],
      events = ['进食', '喝水', '交谈', '睡觉', '捶打墙壁', '自言自语', '搬动椅子', '唱歌', '上网', '梦游', '观望天花板'],
      eventsTypes = ['happy', 'sad', ':]'],
      tools = ['桌子', '椅子', '水杯', '枪', '随从'],
      descs = ['没有完成', '这次失败了', '徒劳', '很满意', '禁止再次发生', '也行', '情况不明', '发现未知征兆'];
  var calEventGenerater = function()
      {
          var start = now.clone().addDays(Math.random() * 400 - 200);
          var e =
          {
              title: (Math.random() > 0.5 ? ('和' + peoples[Math.floor(Math.random()*peoples.length)]) : '') + events[Math.floor(Math.random()*events.length)],
              desc: descs[Math.floor(Math.random()*descs.length)],
              calendar: calendars[Math.floor(Math.random()*calendars.length)],
              allDay: Math.random() > 0.9,
              start: start,
              end: start.clone().addDays(Math.random() * 3)
          };
          return e;
      };
  var calDataGenerater = function(count)
      {
          var data =
          {
              calendars:
              [
                  {name: "success", color: 'green'},
                  {name: "warning", color: 'yellow'},
                  {name: "danger", color: 'red'},
                  {name: "info", color: 'blue'},
                  {name: "important", color: 'brown'},
                  {name: "special", color: 'purple'},
                  {name: "primary", color: 'primary'}
              ],
              events: []
          };

          for (var i = count - 1; i >= 0; i--)
          {
              data.events.push(calEventGenerater());
          }
          

          var nowTime = now.clone();
          var e = {
              title: 1,
              desc: descs[Math.floor(Math.random()*descs.length)],
              calendar: calendars[Math.floor(Math.random()*calendars.length)],
              allDay: false,
              start: nowTime.clone().addDays(2),
              end: nowTime.clone().addDays(5)
          };
          data.events.push(e);

          return data;
      };
  $(function()
  {
    $('.calendar').each(function()
    {
        var $this = $(this);
        var data = calDataGenerater($this.data('exampleCount') || 300);
        $this.calendar({data: data, clickEvent: function(e)
        {
            console.log(e);
            $.zui.messager.show('您点击了 <strong>' + e.event.title + '</strong>');
        }, beforeChange: function(e)
        {
            if(e.change === 'start')
            {
                $.zui.messager.show('起始时间更改为 ' + e.to.format('yyyy年MM月dd日 hh:mm'));
            }
        }});
    });
  });
}
$(afterPageLoad);
</script>
<script src="http://s95.cnzz.com/stat.php?id=1253026255&web_id=1253026255"></script>
<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-53781622-1', 'auto');
  ga('send', 'pageview');
</script>
</body>
</html>
